<%-- 
    Document   : setting
    Created on : 2019-7-17, 14:36:48
    Author     : dusin
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%
    session.setAttribute("url", "../main/setting.jsp");
%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="../../js/jquery/themes/default/easyui.css" type="text/css" />
        <link rel="stylesheet" href="../../js/jquery/themes/icon.css" type="text/css" />
        <script type="text/javascript" src="../../js/jquery/jquery.min.js"></script>
        <script type="text/javascript" src="../../js/jquery/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="../../js/jquery/locale/easyui-lang-zh_CN.js"></script>
        <script language="JavaScript">
            $(document).ready(function() {
                    $.extend($.fn.validatebox.defaults.rules, {  
                    /*必须和某个字段相等*/
                    equalTo: {
                        validator:function(value,param){
                            return $(param[0]).val() === value;
                        },
                        message:'字段不匹配'
                    }
           
                 });
                 
                 $('#fm-password').form({
                    url:'../../servlet/web/setting/UpdatePassword',
                    onSubmit:function(){
			return $(this).form('validate');
                    },
                    success:function(data){
                        var result = eval('(' + data + ')');
			$.messager.alert('Info', result.errorMsg, 'info');
                        $('#fm-password').form('clear');
                    }
                });
                
                $('#fm-mobile').form({
                    url:'../../servlet/web/setting/UpdateMobile',
                    onSubmit:function(){
			return $(this).form('validate');
                    },
                    success:function(data){
                        var result = eval('(' + data + ')');
			$.messager.alert('Info', result.errorMsg, 'info');
                        $('#fm-password').form('clear');
                    }
                });
                
            });
            function changePassword(){
                $('#fm-password').form('submit');
            }
            function changeMobilePhone(){
                $('#fm-mobile').form('submit');
            }
        </script>        

    </head>
    <body>       
        <div id="p" class="easyui-panel" title="设置"
             style="width:500px;height:150px;padding:10px;background:#fafafa;"
             data-options="iconCls:'icon-save',maximized:true">
            <form id="fm-password" method="post" >  
                <div class="fitem">
                    <label>用户名:</label>
                    <input id="username" name="username" class="easyui-textbox"    iconWidth="28" readOnly="true" value="${username}">
                </div>
                <div class="fitem">
                    <label>新密码:</label>
                    <input id="password1" name="password1" class="easyui-passwordbox" validType="length[6,18]"  prompt="Password" iconWidth="28" required="true" >
                </div>
                <div class="fitem" class="easyui-validatebox" required="true">
                    <label>确认密码:</label>
                    <input id="password2" name="password2" class="easyui-passwordbox" prompt="Password" iconWidth="28" required="true" validType="equalTo['#password1']" invalidMessage="两次输入密码不匹配">
                </div>            
            </form>
            <div id="form-buttons">
                <a href="#" style="margin-left: 180px;padding-left:30px" class="easyui-linkbutton" iconCls="icon-ok" onclick="changePassword()">确定</a>                
            </div>
            <hr/>
             <form id="fm-mobile" method="post" >            
                 <div class="fitem" style="display:none;">
                    <label>用户名:</label>
                    <input id="username" name="username" class="easyui-textbox"    iconWidth="28" readOnly="true" value="${username}">
                </div>
                <div class="fitem">
                    <label>手机号码:</label>
                    <input id="phoneNumber" name="phoneNumber" class="easyui-numberbox" validType="length[11,11]"  prompt="手机号码"  required="true" value="${phoneNumber}">
                </div>                       
            </form>
            <div id="mobile-buttons">
                <a href="#" style="margin-left: 180px;padding-left:30px" class="easyui-linkbutton" iconCls="icon-ok" onclick="changeMobilePhone()">确定</a>                
            </div>
        </div>
        <style type="text/css">
            #fm{
                margin:0;
                padding:10px 30px;
            }
            .ftitle{
                font-size:14px;
                font-weight:bold;
                padding:5px 0;
                margin-bottom:10px;
                border-bottom:1px solid #ccc;
            }
            .fitem{
                margin-bottom:5px;
            }
            .fitem label{
                display:inline-block;
                width:80px;
            }
            .fitem input{
                width:160px;
            }
        </style>
    </body>
</html>
